<template>
  <div class="goods">
    <h1>全部商品</h1>
    <ul>
      <!-- <router-link to = "/goodsdetail" tag="li" v-for="(item, index) of Allgoodslist" @click.native="detail(item)" :key="index">
        <img :src="item.pitcures[0].url" alt="">
        <p>{{ item.productdesc }}</p>
        <h3>{{ item.pname }}</h3>
        <h4>￥{{ item.price }}.00</h4>
        <h5>￥{{ item.price }}.00</h5>
        <div class="sales">
          <span>已售{{ item.price }}</span>
          <i>包邮</i>
        </div>
      </router-link> -->
      <li>
        <img src="https://i1.douguo.com/upload/tuan/5/0/0/448_50aececb8cc78de07c657bbe26dc72a0.jpg" alt="">
        <p>香甜酥脆 健康美味</p>
        <h3>安特鲁七哥 葡式蛋挞半成品套装（挞皮*51个+挞液*3盒）</h3>
        <h4>￥65.80</h4>
        <h5>￥85.00</h5>
        <div class="sales">
          <span>已售122</span>
          <i>包邮</i>
        </div>
      </li>
      <li>
        <img src="https://i1.douguo.com/upload/tuan/5/0/0/448_50aececb8cc78de07c657bbe26dc72a0.jpg" alt="">
        <p>香甜酥脆 健康美味</p>
        <h3>安特鲁七哥 葡式蛋挞半成品套装（挞皮*51个+挞液*3盒）</h3>
        <h4>￥65.80</h4>
        <h5>￥85.00</h5>
        <div class="sales">
          <span>已售122</span>
          <i>包邮</i>
        </div>
      </li>
      <li>
        <img src="https://i1.douguo.com/upload/tuan/5/0/0/448_50aececb8cc78de07c657bbe26dc72a0.jpg" alt="">
        <p>香甜酥脆 健康美味</p>
        <h3>安特鲁七哥 葡式蛋挞半成品套装（挞皮*51个+挞液*3盒）</h3>
        <h4>￥65.80</h4>
        <h5>￥85.00</h5>
        <div class="sales">
          <span>已售122</span>
          <i>包邮</i>
        </div>
      </li>
    </ul>
  </div>
</template>

<script>
import axios from 'axios'
export default {
  data () {
    return {
      Allgoodslist: [],
      type: ""
    }
  },
  created () {
    // axios.all([this.getAllgoodsList()]).then(axios.spread((listData) => {
    //     console.log(listData.data.data)
    //     this.Allgoodslist = listData.data.data
    // }))
  },
  methods: {
    // getAllgoodsList () {
    //   return axios.get('http://10.8.162.81:8082/findAll')
    // },
    detail (item) {
      sessionStorage.setItem('id', item.id)
    }
  }
}
</script>

<style lang="scss" scoped>
  .goods{
    width:100%;
    margin-top:0.15rem;
    h1{
      width:100%;
      height:0.25rem;
      font-size:0.15rem;
      padding-left:0.15rem;
    }
    ul{
      width:100%;
      display:flex;
      justify-content:space-between;
      flex-wrap:wrap;
      box-sizing:border-box;
      padding: 0 0.15rem;
      li{
        width:48%;
        height:2.65rem;
        margin-bottom:0.15rem;
        p{
          height:0.2rem;
          line-height:0.2rem;
          width:100%;
          background:#ccc;
          color:#666;
          font-size:0.1rem;
          text-indent:0.05rem;
          white-space: nowrap;
          text-overflow: ellipsis;
          overflow: hidden;
        }
        img{
          width:100%;
          height:1.6rem;
        }
        h3{
          font-size: 0.08rem;
          color: #000;
          width:100%;
          height: 0.35rem;
          display: -webkit-box;
          -webkit-box-orient: vertical;
          -webkit-line-clamp: 2;
          overflow: hidden;
        }
        h4{
          width:100%;
          height: 0.18rem;
          line-height:0.18rem;
          font-size:0.13rem;
          color:#eb2624;
        }
        h5{
          width:100%;
          height: 0.15rem;
          line-height:0.15rem;
          font-size:0.1rem;
          color:#888;
          text-decoration:line-through;
        }
        .sales{
          height:0.2rem;
          line-height:0.2rem;
          color: #000;
          width:100%;
          font-size: 0.08rem;
          color:#888;
          span{
            float:left;
          }
          i{
            float:right;
          }
        }
      }
    }
  }
</style>
